<template>
	<view v-for="(item,index ) in list " :key='index' @click="onClick(item)" class="bg-white round-8 mb-6 wa">
		<button v-if="item.value==3&&WEBCONFIG?.customerType==2" class=" btn-normal  " open-type="contact">
			<view class="flex gap-8 p-14 flex-y-center item">
				<!-- <text :class="`iconfont fs-18 ${item.icon}`"></text> -->
				<image class="w-24 h-24" :src="item.icon"></image>
				<view class="flex-1 fs-15">{{item.lable}}</view>
				<text class="iconfont text-999 fs-14 icon-youjiantou"></text>
			</view>
		</button>
		<view class="flex gap-8 p-14 flex-y-center item" v-else>
			<!-- <text :class="`iconfont fs-18 ${item.icon}`"></text> -->
			
			<image class="w-24 h-24" :src="item.icon"></image>
			<view class="flex-1 fs-15">{{item.lable}}</view>
			<text class="iconfont text-999 fs-14 icon-youjiantou"></text>
		</view>
	</view>
	<y-popup ref="qrPopup" mode="bottom" round='6px'>
		<view class="p-20 flex flex-center">
			<image :src="WEBCONFIG?.customerQrcode" class="w-250 h-250"></image>
		</view>
	</y-popup>
</template>

<script setup>
	import { reactive, ref } from 'vue';
	import { $page } from '@/utils'
	import { useRefs, useWebConfigStore } from '@/stores';
	const { WEBCONFIG } = useRefs(useWebConfigStore())
	const list = reactive([
		{ lable: '充值中心', value: 1, icon: '/static/image/slcz.png', path: '/pages/plans/index' },
		{ lable: '算力明细', value: 2, icon: '/static/image/slmx.png', path: '/pages/capital/list' },
		{ lable: '联系客服', value: 3, icon: '/static/image/lxkf.png', path: '' },
		{ lable: '账号设置', value: 4, icon: '/static/image/zhsz.png', path: '/pages/user/set' },
		{ lable: '应用记录', value: 7, icon: '/static/image/yyjl.png', path: '/pages/app/result' },
		{ lable: '服务协议', value: 5, icon: '/static/image/xfjl.png', path: '/pages/tags/index?key=service' },
		{ lable: '隐私协议', value: 6, icon: '/static/image/ysxy.png', path: '/pages/tags/index?key=privacy' },
	])
	const qrPopup = ref(null)
	const onClick = (e) => {
		if (e.value == 3) {
			// #ifdef H5
			qrPopup.value.open()
			// #endif
			// #ifdef MP-WEIXIN
			if (WEBCONFIG.value.customerType == 3) {
				qrPopup.value.open()
			}
			if (WEBCONFIG.value.customerType == 1) {
				wx.openCustomerServiceChat({
					extInfo: {
						url: WEBCONFIG.value.customerUrl
					},
					corpId: WEBCONFIG.value.customerCorpId,
				})
			}
			// #endif
			return;
		}

		$page.open(e.path)
	}
</script>

<style scoped>
	.btn-normal {
		display: block;
		margin: 0;
		padding: 0;
		line-height: normal;
		background: none;
		border-radius: 0;
		box-shadow: none;
		border: none;
		font-size: unset;
		text-align: unset;
		overflow: visible;
		color: inherit;
	}

	.btn-normal:after {
		border: none;
	}

	.btn-normal.button-hover {
		color: inherit;
	}

	button:after {
		content: none;
		border: none;
	}
</style>